apiready = function() {
    seajs.use(['../../V', "../../api", "../../jquery", "../../app", "../../service"], function(V, $api, $, app, service) {
        var vm = {
            el: '.vue-content',
            data: {
                temList: ['-1'],
                num: '',
                shopGoodsContent: [],
                imgarr: [],
                inp: [],
                allArr: [''],
                tem_index: '',
            },
            mounted: function() {
                var edit = document.querySelector("#shop_add_detail_edit");
                //--textarea框自适应
                $(".inp_class").keyup(function() {
                    this.style.height = 'auto';
                    this.style.height = this.scrollHeight + "px";
                })


                $('.inp_class').focus(function() {
                    this.style.height = 'auto';
                    this.style.height = this.scrollHeight + "px";
                })

                //--textarea框自适应
                // $(".inp_class").css('height','auto');
                // $(".inp_class").css('height',$(".inp_class").prop('scrollHeight')+'px');
                // if($(".inp_class").css('height') == '0px'){
                // 	$(".inp_class").css('height','100px');
                // }
                // console.log($(".inp_class").css('scrollHeight'));

                //--下面两行代码是为了解决ios端添加图片之后没有滚动条出现的bug（暂时只能找到这个方法解决）
                var h = $(".shop_add_detail_edit").height();
                $(".shop_add_detail_edit").height(h + 0.1);
            },
            methods: {
                back: function() {
                    api.closeWin()
                },
                next: function() {
                    $(".firstPage").css("display", "none");
                    $(".shop_add_detail_edit").css("display", "block");
                    $(".add_button").css("display", "block");


                },
                shopAdd: function() {

                    var goodsDescription = this.inp; //商品详情
                    var arrData = [];
                    console.log('description: ' + JSON.stringify(goodsDescription));

                    console.log(JSON.stringify(this.imgarr));

                    for (var i = 0; i < this.allArr.length; i++) {
                        if (this.allArr[i].indexOf("img") == -1) {
                            if (this.allArr[i] != '') {
                                this.allArr[i] = "<p>" + this.allArr[i] + "</p>";
                                arrData.push(this.allArr[i]);
                            }
                        } else {
                            arrData.push(this.allArr[i])
                        }
                    }
                    var all_str = this.allArr.join('')
                    console.log(arrData)
                    api.sendEvent({
                        name: 'shopAdd',
                        extra: {
                            goodsDescription: all_str,
                            detailData: arrData
                        }
                    });
                    api.closeWin()
                },
                //--点击按钮模态框 自己消失
                disappear: function() {
                    $(".shop_add_detail_tool").css("display", "none");
                },
                //--显示按钮模态框
                show_edit: function() {
                    $(".shop_add_detail_tool").css("display", "block");
                },
                //--点击文字按钮
                giveTextFrame: function() {
                    var that = this;

                    if (this.tem_index != '') {
                        console.log(this.tem_index)
                        this.allArr.splice(parseInt(this.tem_index) + 1, 0, '');
                        this.temList.splice(parseInt(this.tem_index) + 1, 0, '-1');

                        var temIndex = this.tem_index;
                        //--$nextTick 是在下次 DOM 更新循环结束之后执行延迟回调，
                        //--在修改数据之后使用 $nextTick，则可以在回调中获取更新后的 DOM
                        this.$nextTick(function() {
                            $('.inp_class').eq(parseInt(temIndex) + 1).focus();
                        })
                        this.tem_index = '';
                    } else {
                        this.temList.push('-1');
                        this.allArr.push('');

                        //--$nextTick 是在下次 DOM 更新循环结束之后执行延迟回调，
                        //--在修改数据之后使用 $nextTick，则可以在回调中获取更新后的 DOM
                        this.$nextTick(function() {
                            $('.inp_class:last').focus();

                            //--解决安卓端输入法挡住输入框的问题
                            var clientHeight = document.body.clientHeight;
                            var ele = document.getElementsByClassName('inp_class')
                            window.addEventListener("resize", function() {
                                if (ele && document.body.clientHeight < clientHeight) {
                                    //使用scrollIntoView方法来控制输入框
                                    ele[ele.length - 1].scrollIntoView(false);
                                }
                            });
                        })

                    }


                    console.log(JSON.stringify(this.temList) + " type: " + this.temList.constructor + " length: " + this.temList.length)
                    console.log(JSON.stringify(this.allArr) + " type: " + this.allArr.constructor + " length: " + this.allArr.length)
                },
                //--点击图片按钮
                givePicture: function() {
                    var that = this;
                    app.getPictureS(50, this.num, service['fileupload'], function(res) {
                        if (res.length > 0) {
                            api.toast({
                                msg: '上传成功',
                                duration: 2000,
                                location: 'bottom'
                            });
                            // console.log("上传的图片数组到底是什么："+res+"\n");
                            for (var i = 0; i < res.length; i++) {
                                // var str1 = res[i].join("");	//--数组转换为字符串
                                that.imgarr.push("<img src='" + res[i] + "'?x-oss-process=image/resize,m_lfit,w_960'/>");

                                if (that.tem_index != '') {
                                    // console.log('在哪插入：'+that.tem_index);
                                    that.allArr.splice(parseInt(that.tem_index) + 1, 0, "<img src='" + res[i] + "'/>");
                                    that.temList.splice(parseInt(that.tem_index) + 1, 0, that.imgarr.length - 1);
                                    that.tem_index++;
                                } else {
                                    that.allArr.push("<img src='" + res[i] + "'/>");
                                    that.temList.push(that.imgarr.length - 1);

                                }
                            }
                            //--把插入标志置空
                            that.tem_index = '';
                            //--已上传的图片数量
                            that.num = that.imgarr.length;
                            console.log("上传的图片数组：" + JSON.stringify(that.imgarr));
                            console.log("已上传图片的数量：" + that.num);
                            //--下面两行代码是为了解决ios端添加图片之后没有滚动条出现的bug（暂时只能找到这个方法解决）
                            var h = $(".shop_add_detail_edit").height();
                            $(".shop_add_detail_edit").height(h + 0.1);
                        }
                    })

                },

                del_el: function(e) {
                    var index = e.target.dataset.index;

                    this.temList.splice(index, 1);
                    this.allArr.splice(index, 1);
                    console.log(JSON.stringify(this.imgarr));

                    // var arr = this.imgarr;
                    // arr.splice(index, 1);
                    // this.imgarr = arr;
                },
                up_el: function(e) {
                    var index = e.target.dataset.index;

                    var lastContent = this.allArr[index - 1];
                    Vue.set(this.allArr, index - 1, this.allArr[index]);
                    Vue.set(this.allArr, index, lastContent);

                    var lastIndex = this.temList[index - 1];
                    Vue.set(this.temList, index - 1, this.temList[index]);
                    Vue.set(this.temList, index, lastIndex);
                },
                down_el: function(e) {
                    var index = e.target.dataset.index;

                    var nextContent = this.allArr[parseInt(index) + parseInt(1)];
                    Vue.set(this.allArr, parseInt(index) + parseInt(1), this.allArr[index]);
                    Vue.set(this.allArr, index, nextContent);

                    var nextIndex = this.temList[parseInt(index) + parseInt(1)];
                    Vue.set(this.temList, parseInt(index) + parseInt(1), this.temList[index]);
                    Vue.set(this.temList, index, nextIndex);
                },
                ins_el: function(e) {
                    var index = e.target.dataset.index;
                    this.tem_index = index;
                    $(".shop_add_detail_tool").css("display", "block");


                },



            },
            created: function() {
                console.log(api.pageParam.shopGoodsContent + " type: " + api.pageParam.shopGoodsContent.constructor);
                if (api.pageParam.shopGoodsContent != '') {
                    this.temList = [],
                        this.shopGoodsContent = api.pageParam.shopGoodsContent;
                    $('.firstPage').css('display', 'none');
                    $(".shop_add_detail_edit").css("display", "block");
                    $(".add_button").css("display", "block");

                    var contentArr = this.shopGoodsContent;

                    for (var i = 0; i < contentArr.length; i++) {
                        if (contentArr[i].indexOf('img') == -1) {
                            this.temList.push('-1');
                            var str = contentArr[i];
                            console.log(contentArr[i] + " type: " + contentArr[i].constructor);

                            str = str.slice(3);
                            console.log(str + "3333");
                            str = str.slice(0, -4);
                            console.log(str + "4444");
                            this.allArr[i] = str;

                        } else {
                            this.temList.push(i);
                            this.imgarr[i] = contentArr[i];
                            this.allArr[i] = contentArr[i];

                        }
                    }
                }
            }
        };

        var even = function() {

        };
        var newVue = new Vue(vm);
        even();

    })
}
